<template>
  <div class="cardgp2tContainer">
    <div class="cardgp2tCard" v-for="(option, index) in options" :key="index">
      <card_g :image-url="option.image" :title="option.title"></card_g>
    </div>
  </div>
</template>

<script setup lang="ts">
import { i18nt } from "@/i18n";
import card_g from "@/components/cards/card_g.vue";

const msg = i18nt.value.constantsTwo;

const options = [
  {
    image: new URL("@/assets/png/smg1/gp5.png", import.meta.url).href,
    title: msg.str3,
    sub: msg.testStr,
  },
  {
    image: new URL("@/assets/png/smg1/gp6.png", import.meta.url).href,
    title: msg.str3,
    sub: msg.testStr,
  },
];
</script>

<style scoped lang="scss">
.cardgp2tContainer {
  @include rel_cen_hw(470px, 100%);
  flex-direction: row;
  justify-content: space-between;
  .cardgp2tCard {
    @include rel_cen_hw(470px, 729px);
  }
}
</style>
